<template>
  <Dialog :appDialog="appDialog">
    <div class="content">
      <div class="title" style="margin-bottom:15px"> <img style="width: 20px;height: 20px;" src="/static/err_tips.png" alt="" /><span>您的企业号绑定已达上限，请联系企微客服开启更多！</span></div>
      <div class="title" style="margin-left:30px">当前绑定企业号：{{totalfrim.bind_num}}</div>
       <div class="title" style="margin:30px 20px 20px 50px"><img style="width: 200px;height: 200px;" src="/static/weiyi.png" alt="" /></div>
       <div class="title" style="margin-left:30px;color:#969696">扫码添加企微客服，开通更多抖音企业号</div>
    </div>
  </Dialog>
</template>
<script setup lang="ts">
  import { ElMessage } from 'element-plus'
  import { ref, reactive, defineProps,computed, watch } from 'vue'
  import Dialog from '@/components/Dialog.vue'
   interface Props {
    totalfrim:any
  }
  const props = withDefaults(defineProps<Props>(), {
     totalfrim: () => {
      return {
        bind_num: '', 
      }
    },
  })
  //确定绑定企业号
  const submitHandel = async () => {
   appDialog.visible = false
  }
  const appDialog = reactive({
    visible: false,
    title: '绑定企业号',
    width: '550px',
    submit: submitHandel,
    submitText: '知道了'
  })
  defineExpose({
    appDialog
  })
</script>
<style lang="scss" scoped>
  .content {
    // height: 100px;
    // line-height: 25px;
        padding: 20px 0px;
    display: flex;
    // align-items: center;
    // justify-content: center;
    flex-direction: column;
    .title{
      display: flex;
      align-items: center;
      // justify-content: center;
      span{
        margin-left: 10px;
      }
    }
  }
</style>
